<!--
 * @Author: Aaron
 * @Date: 2022-05-05 17:45:10
 * @LastEditors: Aaron
 * @LastEditTime: 2022-05-18 14:45:22
 * @Description: file content
 * @FilePath: \ias_ui\src\views\JDSupermarket\index\offer.vue
 * @Company: 沃尔玛
-->
<template>
  <div v-loading="loading" class="offer">
    <offerHeader
      :id="id"
      :check-status="checkStatus"
      :search-data="searchData"
      @changLoading="changLoading"
      @handleSearch="handleSearch"
      @uploadSuccess="(_) => (id = _)"
    />

    <essTable
      ref="table"
      :thead-list="theadList"
      :other-container-box="otherContainerBox"
      :total="total"
      :data-list="dataList"
      :page-params="pageParams"
      empty-text="暂无数据，请先导入文件发起再试试吧"
      @handlePageChange="requestData"
    >
      <template v-slot:checkStatus="{ scope }">{{ scope | transCheckStatus }}</template>
    </essTable>
  </div>
</template>

<script>
import essTable from '@/components/eTable/eTable.vue'
import offerHeader from '../components/offerHeader.vue'
import { productsOfferListHeader as theadList } from '../js/theadList.js'
import { verifyStatus } from '../js/dictionary.js'
import { productOfferList } from '@/api/JDSupermarket/productsList.js'
import { filterKey } from '@/utils/processingData.js'

export default {
  name: 'JDSupermarketProductOffer',
  components: {
    essTable,
    offerHeader
  },
  filters: {
    transCheckStatus({ row }) {
      return filterKey(row.checkStatus, verifyStatus)
    }
  },
  data() {
    return {
      loading: false,
      searchData: {},
      pageParams: {
        pageNum: 1,
        pageSize: 10
      },
      total: 0,
      dataList: [],
      id: null,
      theadList,
      otherContainerBox: ['.pageHeader'],
      checkStatus: null
    }
  },
  methods: {
    changLoading(v) {
      this.loading = v
    },

    handleSearch() {
      this.pageParams.pageNum = 1
      this.requestData()
    },

    async requestData() {
      try {
        if (!this.id) throw new Error('请先导入报价文件后再操作！')
        this.loading = true
        const params = { ...this.pageParams, ...this.searchData, batchId: this.id }
        params.pageNum--
        const { code, result } = await productOfferList(params)
        if (code !== '0' || !result) return
        this.total = result.pageEntity.total || 0
        this.dataList = result.pageEntity.data || []
        this.checkStatus = result.checkStatus || null
      } catch (e){
        this.$message.error(e)
      } finally {
        this.loading = false
      }
    }
  }
}
</script>

<style lang="scss" scoped></style>
